<template>
	<view class="container">
		<myp-status bgType="primary"></myp-status>
		<myp-navbar title="头像" :lefts="lefts" :rights=rights @leftAction="back" @rightAction="showEdit"></myp-navbar>
		<view style="display: flex; justify-content: center;align-items: center;">
			<image src="../../../../static/img/head.jpg" mode="aspectFill" style="width: 700rpx;height: 700rpx;position: relative;"></image>
		</view>
		<myp-popup :show="show" pos="bottom" height="x-180px" @overlayClicked="toCancle">
			<view class="edit">
				<text class="edit-item edit-split edit-text" @click="chooseImg"> 从手机相册选择</text>
				<text class="edit-item edit-split edit-text">保存到手机</text>
				<text class="edit-item edit-split edit-text" @tap="toCancle">取消</text>
			</view>
			<myp-xbar bgType="inverse" boxStyle="width:750rpx;"></myp-xbar>
		</myp-popup>
	</view>

</template>

<script>
	import OssUtil from '../../../../utils/oss-util.js'
	import FileUtil from '../../../../utils/file_uitls.js'
	export default {
		created() {
			uni.hideLoading();
			this.user = uni.getStorageSync('user');
			console.info(this.user);
			if (this.user == null) {
				this.$Router.replace({
					name: "login"
				});
			}
			this.userAccount = this.user.userAccount;
			this.id = this.user.id;
			this.faceImage = this.user.faceImage;
			this.faceImageBig = this.user.faceImageBig;
			this.createTime = this.user.createTime;
		},
		data() {
			return {
				user: null,
				id: "",
				faceImage: "",
				faceImageBig: "",
				userAccount: "",
				createTime: "",

				show: false,
				lefts: [{
					icon: 'left'
				}],
				rights: [{
					icon: 'three-dot'
				}],
				chooseImage: null,
					
				loading:{
					title: "上传中",
					mask: true,
				},
				smallFaceImgOper: "?x-oss-process=style/small"
			}
		},
		methods: {
			back() {
				this.$Router.back();
			},
			showEdit() {
				this.show = true;
			},
			toCancle() {
				this.show = false;
			},
			chooseImg() {
				this.toCancle();
				const that = this;
				uni.chooseImage({
					count: 1,
					sizeType: "original",
					sourceType:["album "],
					success(res) {
						console.info(res);
						//uni.showLoading(that.loading);
						that.getUpLoadAccess(res.tempFilePaths[0]);
					},
					fail(res) {
						uni.hideLoading();
						uni.showToast({
							title: "上传失败",
							icon: "none",
						});
						return;
					}
				});

			},
			 async getUpLoadAccess(filename) {
				 var that = this;
				 await uni.request({
					url: this.baseUrl + '/cim/server/oss/get/access',
				 	method:"GET",
					timeout: 20000,
					data: {
						"id": this.id,
						"type" : "faceImg"
					},
					
					success:(res) => {
						console.info(res);
						if(res.data.status != 200) {
							uni.hideLoading();
							uni.showToast({
								title: "上传失败",
								icon: "none",
							});
							return;
						}
						const data = res.data.datamap;
						console.info(data);
						var securityToken = data.securityToken;
						var accessKeySecret = data.accessKeySecret;
						var accessKeyId = data.accessKeyId;
						var signature = data.signature;
						var expireEndTime = data.expireEndTime;
						var polocyBase64 = data.polocyBase64;
						var dir = data.dir;
						var url = data.url;
						var region = data.region;
						var buckName = data.buckName;
						var endpoint = data.endpoint;
						
						var oss = new OssUtil(data);
						
						var new_multipart_params = oss.get_upload_param(filename,'user/faceImage/',false,this.id);
						console.info(new_multipart_params)
						
						uni.uploadFile({
							url: url,
							filePath: filename,
							fileType:'image',
							name:'file',
							formData: new_multipart_params,
							success: (res) => {
								console.info(res);
								that.user.faceImageBig = new_multipart_params.key;
								that.user.faceImage = new_multipart_params.key + that.smallFaceImgOper;
								uni.request({
									url:that.baseUrl + "/cim/server/user/update",
									data: that.user,
									method: "POST",
									success: (res) => {
										if(res.data.status != 200) {
											return;
										}
										uni.hideLoading();
										var client = oss.client;
										
										let signatureUrlBig = client.signatureUrl(that.user.faceImageBig);
										console.info(signatureUrlBig);										
										
										uni.downloadFile({
											url: signatureUrlBig,
											success(resp) {
												console.info(resp.tempFilePath);
												if(resp.statusCode != 200){
													console.info("下载失败");
													return;
												}
												uni.saveFile({
													tempFilePath: resp.tempFilePath,
													success(res){
														console.info(res);
														var pos = res.savedFilePath.lastIndexOf('/');
														var name = res.savedFilePath.substring(pos + 1);
														FileUtil.copyFile(res.savedFilePath,that.user.id + '/' + 'faceImage',name);
														
													},
													error(res){
														console.info(res);
														
													}
												});
												
											}
										})
										
									},
									fail: (res) =>{
										uni.hideLoading();
										uni.showToast({
											title: "上传失败",
											icon: "none",
										});
									}
								})
								
								
							},
							fail: (res) => {
								uni.hideLoading();
								uni.showToast({
									title: "上传失败",
									icon: "none",
								});
								console.info(res);
							}
						})
						
					},
					fail:(res) => {
						console.info(res);
						uni.showToast({
							title: "上传失败",
							icon: "none",
						});
						return;
					}
				 })
				
				
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("@/static/global.css");
	
	.container {
		width: 100%;
		height: 100vh;
		background: #000000;
	}

	.edit {
		width: 750rpx;
		height: 180px;
		background-color: #FFFFFF;
		border-top-left-radius: 24rpx;
		border-top-right-radius: 24rpx;
		display: flex;
		flex-direction: column;

		&-item {
			width: 750rpx;
			height: 60px;
			line-height: 60px;
			text-align: center;
		}

		&-split {
			border-bottom-width: 1px;
		}

		&-title {
			font-size: 18px;
			font-weight: 600;
		}

		&-text {
			font-size: 15px;
		}
	}
</style>
